<template>
    <el-form-item :label="ctx.label.value">
        <div class="upload-box">
            <div><el-input v-model="viewData.value"></el-input></div>
            <div class="upload-btn">
                <el-upload>
                    <template #trigger>
                        <el-button type="primary" icon="upload">上传文件</el-button>
                    </template>
                </el-upload>
                <el-button type="info">选择文件</el-button>
            </div>
        </div>
    </el-form-item>
</template>

<script lang="ts" setup>
import { reactive } from 'vue'
import { byId } from '../lib/form'

const props = defineProps<{ id: string }>()
const ctx = byId(props.id)

const viewData = reactive({
    value: undefined,
})
</script>

<style scoped lang="scss">
.upload-box {
    display: flex;
    .upload-btn {
        display: flex;
        button {
            margin-left: 10px;
        }
    }
}
</style>
